<template>
  <!-- 修改 -->
  <Top-Page class="modify-wrap">
    <cu-custom bgColor="bg-gradual-white-3" :isBack="true">
      <template #content>{{ title }}</template>
      <template #right>
        <view class="cu-custom__right-btn" @click.stop="navBack">保存</view>
      </template>
    </cu-custom>

    <Field clearable autosize :maxlength="maxlength" :placeholder="`${title}`" v-model.trim="value" />

    <view class="modify-hint"></view>
  </Top-Page>
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import recruitApi from "@/api/recruit.js"; //招聘相关API

const title = ref("");
const maxlength = ref(120);
const value = ref("");
let type = "";

onLoad((param: any) => {
  type = param.type;
  title.value = param.name;
  maxlength.value = param.maxlength ?? 120;
});

const navBack = () => {
  const api = type === "introduce" ? "introducechange" : type === "intention" ? "intention" : "";
  const params = type === "introduce" ? { content: value.value } : "";

  recruitApi[api](params).then((res) => {
    const mine = uni.getStorageSync("mine");
    mine[type] = value.value;
    uni.setStorageSync("mine", mine);
    uni.navigateBack();
  });
};
</script>

<style lang="scss" scoped>
.modify-wrap {
  :deep(.field-box) {
    background-color: #fff;
    padding-top: 40rpx;
    padding-bottom: 40rpx;
    text-align: left;
  }

  :deep(.field-value) {
    text-align: left;
  }

  :deep(.nav-bar__right-text) {
    padding: 0 24rpx;
    height: calc(var(--amplified_base) * 56rpx);
    background: #1677ff;
    border-radius: 8rpx;
    font-weight: 400;
    font-size: calc(var(--amplified_base) * 28rpx);
    color: #ffffff;
    text-align: center;
  }

  .modify-hint {
    color: #a4a4a4;
    font-size: 28rpx;
    font-style: normal;
    font-weight: 400;
  }
}
</style>
